import { Button, Form, Input, Select, DatePicker } from "antd";
import React from "react";
const { RangePicker } = DatePicker;
function SearchForm({ onSearch }) {
  const onFinish = (value) => {
    onSearch({
      name: value.name,
      job: value.job,
      status: value.status,
      start_time: value.time ? value.time[0].format("YYYY-MM-DD") : undefined,
      end_time: value.time ? value.time[1].format("YYYY-MM-DD") : undefined,
    });
  };
  const onReset = () => {
    onSearch({ name: "", job: "", status: "", start_time: "", end_time: "" });
  };
  return (
    <div>
      <Form onFinish={onFinish} onReset={onReset}>
        <Form.Item name="name">
          <Input />
        </Form.Item>
        <Form.Item name="job">
          <Select>
            <Select.Option value="销售员"></Select.Option>
            <Select.Option value="总经理"></Select.Option>
            <Select.Option value="销售助理"></Select.Option>
          </Select>
        </Form.Item>
        <Form.Item name="time">
          <RangePicker />
        </Form.Item>
        <Form.Item>
          <Button htmlType="submit">搜索</Button>
          <Button htmlType="reset">重置</Button>
        </Form.Item>
      </Form>
    </div>
  );
}

export default React.memo(SearchForm);
